<template>
  <div>
    <el-input
        type="textarea"
        :rows="30"
        placeholder="请输入内容"
        v-model="textarea">
    </el-input>

    <el-row>
      <el-col :span="12">
        <el-button type="info" plain @click="add()" >添加卡密</el-button>
      </el-col>
      <el-col :span="12">
        <el-button type="info" plain @click="openNewPage" >生成卡密</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import apiClient from '@/utils/axios'
import { ElMessage } from 'element-plus'

const textarea = ref<string>('')
const admin = ref<string>('')

const add = () => {
  let keys = textarea.value.trim()
  if (!keys) {
    ElMessage({
      message: '请输入卡密',
      type: 'error',
      placement: 'top-right',
    })
    return
  }
  keys = keys.replace(/\n/g, ',')

  apiClient
    .get('/admin/add_keys', {
      params: {
        keys,
        addOperator: admin.value,
      },
    })
    .then((result) => {
      if (result.data.status === 200) {
        ElMessage({
          message: '添加成功',
          type: 'success',
          placement: 'top-right',
        })
        textarea.value = ''
      } else {
        ElMessage({
          message: result.data.msg,
          type: 'error',
          placement: 'top-right',
        })
      }
    })
}

const openNewPage = () => {
  window.open('https://zxso.net/tool/cardrand', '_blank')
}

onMounted(() => {
  admin.value = localStorage.getItem('a') || ''
})
</script>

<style scoped>
.el-button{
  margin-top:10px;width: 100%
}
</style>